<template>
  <component
    :is="to ? 'RouterLink' : 'a'"
    v-i-tooltip="tooltip"
    href="#"
    :to="to"
    class="text-neutral-400 hover:text-neutral-600"
    @click="handleClickEvent"
  >
    <slot>
      <Icon :icon="icon" class="h-4 w-4 text-current" />
    </slot>
  </component>
</template>

<script setup>
const props = defineProps(['icon', 'tooltip', 'to'])
const emit = defineEmits(['click'])

function handleClickEvent(e) {
  if (props.to) {
    e.preventDefault()
  }

  emit('click', e)
}
</script>
